<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/views/include/taglib.jsp" %>

<!DOCTYPE html>
<!--[if IE 8]> <html lang="zh" class="ie8 no-js"> <![endif]-->
<!--[if IE 9]> <html lang="zh" class="ie9 no-js"> <![endif]-->
<!--[if !IE]><!-->
<html>
<!--<![endif]-->
<!-- BEGIN HEAD -->
<head>
    <title>报表设计</title>
    <meta name="decorator" content="blank"/>
</head>

<body style="background: white;">
<sys:message content="${message}"/>
<div class="row">
    <div class="col-md-12">
        <!-- 报表设计器 -->
        <div id="report-datagrid"></div>
    </div>
    <div id="report-designer-dlg">

        <div class="tabbable tabbable-custom">

            <ul class="nav nav-tabs">

                <li class="active"><a href="#report-basic-conf-tab" data-toggle="tab">基本设置</a>
                </li>

                <li><a href="#report-query-param-tab" data-toggle="tab">查询参数</a></li>

            </ul>

            <div class="tab-content">
                <div class="tab-pane active" id="report-basic-conf-tab">
                    <div id="report-basic-conf-form-div">
                        <form id="report-basic-conf-form" name="report-basic-conf-form"
                              method="post">
                            <table class="designer-table" style="width: 100%">
                                <tr>
                                    <td style="width: 5%;">名称:</td>
                                    <td style="width: 20%;"><input type="text" id="report-name" name="name"
                                    />
                                    </td>
                                    <td style="width: 5%;">数据源:</td>
                                    <td style="width: 20%;"><select id="report-dsId" name="dsId"
                                    >
                                    </select>
                                    </td>
                                    <td style="width: 5%;">布局列:</td>
                                    <td style="width: 20%;"><select id="report-layout" name="layout"
                                    >
                                        <option value="1">横向展示</option>
                                        <option value="2">纵向展示</option>
                                    </select>
                                    </td>
                                    <td style="width: 5%;">统计列:</td>
                                    <td style="width: 20%;"><select id="report-statColumnLayout"
                                                                    name="statColumnLayout"
                                    >
                                        <option value="1">横向展示</option>
                                        <option value="2">纵向展示</option>
                                    </select>
                                    </td>
                                </tr>
                                <tr>
                                    <td>显示几天数据:</td>
                                    <td><input type="text" id="report-dataRange"
                                               name="dataRange"
                                               value="7"
                                               data-options="required:true,validType:'digit'"
                                    /></td>
                                    <td>状态:</td>
                                    <td><select id="report-status" name="status"
                                    >
                                        <option value="0">禁用</option>
                                        <option value="1" selected="selected">启用
                                        </option>
                                    </select>
                                    </td>
                                    <td>显示顺序:</td>
                                    <td>
                                        <input type="text" id="report-sequence"
                                               name="sequence"
                                               value="100"
                                               data-options="required:true,validType:'digit'"
                                        />
                                    </td>
                                </tr>
                                <tr>
                                    <td>SQL语句:</td>
                                    <td colspan="7" id="report-sqlText-td">
                                           <textarea id="report-sqlText" style="width: 100%;height:180px;"
                                                     name="sqlText"></textarea>
                                        <input type="hidden" id="report-id" name="id"
                                               value=""/>
                                        <input type="hidden" id="report-uid"
                                               name="uid"/>
                                        <input type="hidden" id="report-categoryId"
                                               name="categoryId" value="0"/>
                                        <input type="hidden" id="report-sqlTextIsChange"
                                               name="isChange" value="0"/>
                                        <input type="hidden" id="report-queryParams"
                                               name="queryParams"/>
                                        <input type="hidden" id="report-comment"
                                               name="comment" value=""/>
                                    </td>
                                </tr>
                                <tr>
                                    <td colspan="8" style="text-align: center;">
                                        <a id="btn-report-exec-sql" href="#"
                                           class="btn btn-info btn-xs"><i class="fa fa-search"></i>执行SQL</a>&nbsp;&nbsp;
                                        <a id="btn-report-preview-sql" href="#"
                                           class="btn btn-success btn-xs"><i class="fa fa-search"></i>预览SQL</a>
                                    </td>

                                </tr>
                            </table>
                        </form>
                    </div>
                    <div id="report-meta-column-div" style="height:180px;">
                        <div id="report-meta-column-grid" title="元数据列配置"></div>
                    </div>
                </div>
                <div class="tab-pane" id="report-query-param-tab">
                    <div id="report-query-param-form-div">
                        <form id="report-query-param-form" method="post">
                            <table class="designer-table" style=" width: 100%;">
                                <tr>
                                    <td style="width: 5%;">参数名:</td>
                                    <td style="width: 20%;"><input type="text" id="report-query-param-name"
                                                                   name="name"
                                    /></td>
                                    <td style="width: 5%;">标题:</td>
                                    <td style="width: 20%;"><input type="text" id="report-query-param-text"
                                                                   name="text"
                                    /></td>
                                    <td style="width: 5%;">默认值:</td>
                                    <td style="width: 20%;"><input type="text"
                                                                   id="report-query-param-defaultValue"
                                                                   name="defaultValue" />
                                    </td>
                                    <td style="width: 5%;">默认标题:</td>
                                    <td style="width: 20%;"><input type="text"
                                                                   id="report-query-param-defaultText"
                                                                   name="defaultText" />
                                    </td>
                                </tr>
                                <tr>
                                    <td>数据类型:</td>
                                    <td><select id="report-query-param-dataType"
                                                name="dataType"
                                                data-options="required:true"
                                                style="width:150px">
                                        <option value="string" selected="selected">字符串
                                        </option>
                                        <option value="float">浮点数（包括双精度、浮点数)</option>
                                        <option value="integer">整数</option>
                                        <option value="date">日期</option>
                                    </select></td>
                                    <td>数据长度:</td>
                                    <td><input type="text" id="report-query-param-width"
                                               name="width"
                                               value="100"
                                               data-options="validType:'digit'"
                                               style="width:150px"/></td>
                                    <td>是否必选:</td>
                                    <td><input type="checkbox"
                                               id="report-query-param-required"
                                               name="required"/></td>
                                    <td>是否自动提示:</td>
                                    <td><input type="checkbox"
                                               id="report-query-param-autoComplete"
                                               name="autoComplete"/></td>
                                </tr>
                                <tr>
                                    <td>表单控件:</td>
                                    <td><select id="report-query-param-formElement"
                                                name="formElement"
                                                style="width:150px">
                                        <option value="select">下拉单选</option>
                                        <option value="selectMul">下拉多选</option>
                                        <option value="checkbox">复选框</option>
                                        <option value="text">文本框</option>
                                        <option value="date">日期</option>
                                    </select></td>
                                    <td>内容来源类型</td>
                                    <td colspan="5"><select
                                            id="report-query-param-dataSource"
                                            name="dataSource"
                                            style="width:150px">
                                        <option value="sql">SQL语句</option>
                                        <option value="text">文本字符串</option>
                                        <option value="none">无内容</option>
                                    </select></td>
                                </tr>
                                <tr>
                                    <td>内容:</td>
                                    <td colspan="7">
                            <textarea id="report-query-param-content" name="content" style="width: 95%; height: 100px;"
                                      placeholder="(select col1 as name,col2 as text from table ...) or (name1,text1|name2,text2|...) or (name1|name2|...)"></textarea>
                                        <input type="hidden"
                                               id="report-query-param-gridIndex"
                                               value="0"/>
                                        <input type="hidden"
                                               id="report-query-param-json"/>
                                </tr>
                                <tr>
                                    <td colspan="8" style="text-align: center;">
                                        <a id="btn-report-query-param-add" href="#"
                                           class="btn btn-info btn-xs"
                                           iconCls="icon-add"><i class="fa fa-plus"></i> 增加</a>&nbsp;&nbsp;
                                        <a id="btn-report-query-param-edit" href="#"
                                           class="btn btn-success btn-xs"
                                        ><i class="fa fa-edit"></i>修改</a>
                                </tr>
                            </table>
                        </form>
                    </div>
                    <div id="report-query-param-div" style="height:180px;">
                        <div id="report-query-param-grid" title="查询参数列表"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<link rel="stylesheet" href="${ctxStatic}/assets/global/plugins/vendor/codemirror/lib/codemirror.css"/>
<link rel="stylesheet" href="${ctxStatic}/assets/global/plugins/vendor/codemirror/theme/rubyblue.css"/>
<link rel="stylesheet" href="${ctxStatic}/assets/global/plugins/vendor/codemirror/addon/hint/show-hint.css"/>
<link rel="stylesheet" href="${ctxStatic}/assets/global/plugins/datatables/datatables.min.css"/>
<script src="${ctxStatic}/assets/global/plugins/datatables/datatables.min.js" type="text/javascript"></script>
<script src="${ctxStatic}/assets/global/plugins/vendor/codemirror/lib/codemirror.js"></script>
<script src="${ctxStatic}/assets/global/plugins/vendor/codemirror/mode/sql/sql.js"></script>
<script src="${ctxStatic}/assets/global/plugins/vendor/codemirror/addon/display/fullscreen.js"></script>
<script src="${ctxStatic}/assets/global/plugins/vendor/codemirror/addon/hint/show-hint.js"></script>
<script src="${ctxStatic}/assets/global/plugins/vendor/codemirror/addon/hint/sql-hint.js"></script>
<script src="${ctxStatic}/assets/pages/scripts/designer.js" type="text/javascript"></script>
<%@ include file="/views/include/foot.jsp" %>
</body>
</html>